<!--  -->
<template>
  <div class="order-list">
      <HeaderTop title="订单列表"></HeaderTop>
        <div class="order-container">
        <div class="order-mian">
          <!-- 订单表格 -->
          <el-table max-height="700" class="order-table" :data="tableData"  v-loading="loading2" style="width: 100%" :span-method="objectSpanMethod">
            <el-table-column prop="userName" label="反馈人"></el-table-column>
            <el-table-column prop="remarkType" label="反馈类型"></el-table-column>
            <el-table-column prop="remark" label="反馈内容"></el-table-column>
            <el-table-column prop="createTime" label="反馈时间"></el-table-column>
          </el-table>
          <!-- 分页 -->
          <div class="block" v-if='tableData&&tableData.length>0'>
           <!-- <el-button type="primary" @click='prev()'>上一页</el-button>
           <el-button type="primary" @click='next()'>下一页</el-button> -->
            <el-pagination class='pagenation' 
              background
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page.sync="currentPage"
              layout="total, prev, pager, next, jumper"
              :page-size="size"
              :total="totalSize">
            </el-pagination>
            
          </div>
        </div>
      </div>
    </div>
</template>

<script>
import HeaderTop from '../../components/HeaderTop.vue'
export default {
  data () {
    return {
      currentPage: 1,
      size:10,
      userId:'',
      token:'',
      totalSize: 0,//數目總共有幾條
      // pageSize:3,
      loading2:true,
      // tableData: [{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   },{
      //     suggestMan: '笑看人生',
      //     suggestType:'产品反馈',
      //     suggestContent:'差很好喝。就是分量太少了点',
      //     suggestTime:'2018年12月10日 21:25:21',
      //   }],
        tableData:[]
    };
  },

  components: {
    HeaderTop,
  },

  computed: {},
  created(){
    this.userId = sessionStorage.getItem('userId')
    this.token = sessionStorage.getItem('token')
    this.getSuggestList();
  },
  methods: {
    objectSpanMethod({ row, column, rowIndex, columnIndex }){
      // 合并单元格逻辑
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
    },
    handleCurrentChange(val) {
      this.currentPage = val
      this.getSuggestList()
    },
    //获取数据
    async getSuggestList(){
        const result = await this.API.reqRemarkInfoList({managerInfoId:this.userId,token:this.token,num:this.currentPage,size:this.size})
        if(result.retCode == '000'){
          this.loading2 = false;
          this.tableData = result.retData.remarkInfoSubs;
          this.totalSize = result.retData.count
        }
    },
    // prev(){
    //   this.currentPage--;
    //   this.getSuggestList()
    // },
    // next(){
    //   this.currentPage++;
    //   this.getSuggestList();
    // },
   
  }
}

</script>
<style lang='stylus'>
  .ivu-modal-mask
    background rgba(210,210,210,.1)
  .ivu-modal-content
    overflow hidden
    .ivu-modal-header
      padding 0
      border none
      span
        margin-left 10px
        font-weight bold
    .ivu-modal-footer
      border none
</style>

<style lang='stylus' scoped>
.order-list
  height 100%
  .order-container
    height 100%
    .order-mian
      position relative
      margin-top 80px
      height 763px
      .order-table
        border-top-left-radius 15px
        border-top-right-radius 15px
        .main
          color red
     
.pagenation 
  posItion absolute 
  bottom 20px
  left 50%
  transform  translateX(-50%)
</style>
